{include file="common/header-top" /}


<style>
    .user-name{
        font-size: 15px;
        font-weight: 600;
    }
    .van-circle__text{
        font-size: 18px !important;
    }
</style>


<div id='app' v-cloak>

    <van-nav-bar
            title="个人中心"
            @click-right="userSetting"
            left-arrow
            @click-left="goBack"
            left-text="返回"
    >
        <van-icon name="setting-o" slot="right" />
    </van-nav-bar>

    <!--头部用户头像-->
    <van-row style="margin-top: 5px;">
        <van-col span="18" offset="2">
            <div style="display: inline-block;">
                <van-image
                        width="70px"
                        height="65px"
                        fit="cover"
                        round
                        van-image
                        :src="userInfo.avatar"
                        show-error="获取头像失败！"
                        @click="userSetting"
                >
                    <template v-slot:loading>
                        <van-loading type="spinner"></van-loading>
                    </template>
                </van-image>
                <van-icon name="/__FRONT__/images/icon/wechat-logo.png" style="margin-left: -25%;"></van-icon>
            </div>
            <ul style="display: inline-block; margin-left: -4%;">
                <li>
                    <span class="van-ellipsis user-name">{{userInfo.wechat_nickname}}</span>
                </li>
                <li>
                    <van-icon :name="userGroup.group_logo" size="15px" />
                </li>
            </ul>
        </van-col>

        <van-col span="4"  @click="goCreditScore">
            <van-circle
                    v-model="currentRate"
                    :rate="userExtend.credit_score"
                    :speed="100"
                    :text="creditPointsText"
                    :stroke-width="100"
                    color="#32a14a"
                    size="68px"
                    style='background: url("/__FRONT__/images/icon/xin-icon-1.png") center no-repeat;font-size: 18px'
                    class="money-font"
            />
        </van-col>

    </van-row>
    <!--头部用户头像-->


    <van-divider></van-divider>

    <!--广告或快捷操作-->
    <van-notice-bar :scrollable="false" wrapable v-show="isShowUserInfo" style="padding: 8px 1px;">
        <van-row>
            <van-col span="4">
                <van-icon name="/__FRONT__/images/icon/user-jianli.png" size="50px">
                </van-icon>
            </van-col>
            <van-col span="14">
                <strong style="font-size: 16px;" class="van-ellipsis">您还未认证哦！</strong><br/>
                <span class="van-ellipsis" style="font-size: small;">认证成功能提升审核通过率哦～</span>
            </van-col>
            <van-col span="6">
                <van-button round type="danger" url="/index/Usercenter/userSetting">立即完善</van-button>
            </van-col>
        </van-row>
    </van-notice-bar>
    <!--广告或快捷操作-->



    <!--钱包中心-->
    <van-row>
        <van-col span="24">
            <van-grid :column-num="2" icon-size="45px">
                <van-grid-item
                        icon="/__FRONT__/images/icon/recharge.png"
                        text="充值"
                        url="/index/Userwallet/buyBean"
                ></van-grid-item>
                <van-grid-item
                        icon="/__FRONT__/images/icon/user-wallet.png"
                        text="钱包中心"
                        url="/index/Userwallet/index"
                ></van-grid-item>
            </van-grid>
        </van-col>
    </van-row>
    <!--钱包中心-->



    <van-divider style="margin-top: 0;"></van-divider>



    <!--我的服务列表-->
    <van-row>
        <van-col span="24">
            <van-cell title="我的服务" icon="/__FRONT__/images/icon/user-job-status-4.png">
            </van-cell>
            <van-grid :column-num="4" icon-size="45px">
                <van-grid-item
                        icon="/__FRONT__/images/icon/user-center-apply.png"
                        text="我的兼职"
                        url="/index/Usercenter/joinJobList?type=0"
                ></van-grid-item>
                <van-grid-item
                        icon="/__FRONT__/images/icon/user-hire.png"
                        text="我的招聘"
                        url="/index/Usercenter/publishJobList"
                ></van-grid-item>
                <van-grid-item
                        icon="/__FRONT__/images/icon/market.png"
                        text="我的二手"
                        url="/index/Market/publishGoodsList"
                ></van-grid-item>
                <van-grid-item
                        icon="/__FRONT__/images/icon/publish-job.png"
                        text="我要发布"
                        url="/index/Usercenter/publishCenter"
                ></van-grid-item>
            </van-grid>
        </van-col>
    </van-row>
    <!--我的服务列表-->


    <van-divider></van-divider>



    <!--服务列表-->
    <van-row >
        <van-col span="24">
            <!--<van-cell title="服务" icon="/__FRONT__/images/icon/user-service.png"></van-cell>-->
            <van-cell-group >
                <!--<van-cell title="健康证" icon="/__FRONT__/images/icon/user-jiankang.png" is-link></van-cell>-->
                <van-cell
                        title="我的收藏"
                        icon="/__FRONT__/images/icon/user-collect.png"
                        is-link
                        url="/index/Usercenter/collectList"
                ></van-cell>
                <van-cell
                        title="新手指南"
                        icon="/__FRONT__/images/icon/user-help.png"
                        is-link
                        url="/index/News/helpCenter"
                ></van-cell>
                <van-cell
                        title="联系我们"
                        icon="/__FRONT__/images/icon/user-kefu.png"
                        is-link
                        url="/index/News/singlePage?pageFlag=contact"
                ></van-cell>
                <!--
                <van-cell
                        title="清空缓存"
                        icon="/__FRONT__/images/icon/user-kefu.png"
                        is-link
                        url="/index/Test/clearSession"
                ></van-cell>
                -->
            </van-cell-group>
        </van-col>
    </van-row>
    <!--服务列表-->


    {include file="common/foot-bar" /}

</div>




<script>

    Vue.use(vant.Lazyload);

    var vm = new Vue({
        el: '#app',
        data() {
            return {
                currentRate: 0,
                active:3,
                userCenterIcon: {
                    normal: '/__FRONT__/images/icon/usercenter-n.png',
                    active: '/__FRONT__/images/icon/usercenter-a.png'
                },
                erShouIcon: {
                    normal: '/__FRONT__/images/icon/ershou-n.png',
                    active: '/__FRONT__/images/icon/ershou-a.png'
                },
                isShowUserInfo: false,
                userInfo:{},
                userGroup:{},
                userExtend:{
                    credit_score: ''
                },
            };
        },

        created(){
            //获取用户信息
            axiosRequest.get('/api/user/userInfo', {params:{userGroup:1,userExtend:1}}).then(function (response) {
                if (response.code == 200) {
                    vm.$data.isShowUserInfo = response.data.isShowUserInfo;
                    vm.$data.userInfo = response.data.userInfo;
                    vm.$data.userGroup = response.data.userInfo.groupInfo;
                    vm.$data.userExtend = response.data.userInfo.extend;
                } else {
                    vant.Toast(response.msg);
                }
            });

        },

        computed:{
            creditPointsText(){
                return this.userExtend.credit_score + '分';
            },
        },

        methods:{
            //返回上一页
            goBack(){
                history.back();
            },
            //用户设置
            userSetting(){
                window.location.href = '/index/Usercenter/userSetting';
            },
            //我的钱包
            myWallet(){
                window.location.href = '/index/Userwallet/index';
            },
            //我的信用分界面
            goCreditScore(){
                window.location.href = '/index/Usercenter/creditScore';
            }
        }
    });




</script>







{include file="common/foot-bottom" /}

